import { cloneDeep, merge } from 'lodash'

interface TV {
    type: string
    value: number
}
/**
 * mini面积图
 */
const tinyAreaOption = {
    height: 50,
    autoFit: false,
    smooth: true,
    line: { size: 0 },
    areaStyle: { fill: '#344fcb', fillOpacity: 0.75 },
}
export const warnTinyAreaOption = (data: number[]) => merge(cloneDeep(tinyAreaOption), { data })
export const dangerTinyAreaOption = (data: number[]) => merge(cloneDeep(tinyAreaOption), { data })

/**
 * 饼图
 */
const pieConfig = {
    appendPadding: 10,
    height: 150,
    angleField: 'value',
    colorField: 'type',
    radius: 1,
    legend: false as false,
    label: {
        type: 'inner',
        offset: '-50%',
        style: { textAlign: 'center' },
        autoRotate: false,
        content: '{name}\n{value}\n{percentage}',
    },
    interactions: [{ type: 'element-active' }],
    pieStyle: { lineWidth: 0 },
}
export const awakenPieOption = (data: TV[]) =>
    merge(cloneDeep(pieConfig), { data, theme: { colors10: ['#3843a8', '#344fcb', '#2c77c1'] } })

const roseConfig = {
    xField: 'type',
    yField: 'value',
    seriesField: 'type',
    radius: 0.9,
    legend: false as false,
    sectorStyle: {
        lineWidth: 0,
    },
    label: { style: { fill: '#fff' } },
}
export const volRoseOption = (data: TV[]) => merge(cloneDeep(roseConfig), { data })
